

<template>
<div>
  <router-link to="/home">
     vue3中ts使用
  </router-link>|
   <router-link to="/cart">
     vue3的方法
  </router-link>|
  <router-link to="/play">
     vue3中ts222
  </router-link>|
    <router-link to="/mine">
     vue3中elementplus
  </router-link>|
      <router-link to="/cate">
     鼠标练习
  </router-link>
  
</div>
<!--<keep-alive 缓存组件
产生俩个生命周期 actived 和deactived 
俩个属性 exclude 不缓存的组件 include 缓存的组件的name  -->

      <keep-alive   v-if="$route.meta.keepAlive">
        <router-view></router-view>
      </keep-alive>
      <router-view  v-if="!$route.meta.keepAlive"></router-view>
     



</template>
<script setup lang="ts">



</script>
<style scoped>
.logo {
  height: 6em;
  padding: 1.5em;
  will-change: filter;
  transition: filter 300ms;
}
.logo:hover {
  filter: drop-shadow(0 0 2em #646cffaa);
}
.logo.vue:hover {
  filter: drop-shadow(0 0 2em #42b883aa);
}
</style>
